{extend name="../../../view/public/base" /}

{block name="css"}
<style>
    body {
        background-color: #F2F2F2;
    }

    .xm-body {
        height: 400px !important;
        overflow-y: scroll !important;
    }

    .layui-form-selected dl {
        height: 200px !important;
        overflow-y: scroll !important;
    }
</style>
{/block}

{block name="body"}
<div style="padding: 20px; background-color: #F2F2F2;">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card" style="padding: 20px">
                <br><br>
                <form class="layui-form" lay-filter="addForm" autocomplete="off">
                    <input type="hidden" id="id" name="id" value="{$data.id? $data.id : 0}"/>
                    <input name="rule_ids" type="hidden"  value="{$data.rules? $data.rules : 0}">
                    <div style="padding: 3px; background-color: #F2F2F2;">
                        <div class="layui-row layui-col-space3">
                            <div class="layui-col-md12">
                                <div class="layui-card">
                                    <div class="layui-card-header"><span class="layui-badge layui-bg-black">设置登录密码</span></div>
                                    <div class="layui-card-body">
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">手机号</label>
                                            <div class="layui-input-block">
                                                <input type="number" name="mobile" lay-verify="required" placeholder="手机号"   autocomplete="off" class="layui-input" value="{$data.mobile?$data.mobile:''}" disabled>
                                            </div>
                                        </div>
                                        <div class="layui-form-item">
                                            <label class="layui-form-label"><span style="color: red">*</span>密码</label>
                                            <div class="layui-input-block">
                                                <input type="password" name="password"  placeholder="密码" autocomplete="off" class="layui-input" >
                                            </div>
                                        </div>
                                        <div class="layui-form-item">
                                            <label class="layui-form-label"><span style="color: red">*</span>确认密码</label>
                                            <div class="layui-input-block">
                                                <input type="password" name="password2"  placeholder="请再输入一次密码" autocomplete="off" class="layui-input" >
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-col-md12">
                                <div class="layui-card">
                                    <div class="layui-card-header"><span class="layui-badge layui-bg-black">设置安全密码</span></div>
                                    <div class="layui-card-body">
                                        <div class="layui-form-item">
                                            <label class="layui-form-label"><span style="color: red">*</span>安全密码</label>
                                            <div class="layui-input-block">
                                                <input type="password" name="safe_password"  placeholder="安全密码"  autocomplete="off" class="layui-input" >
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <br>
                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <button type="button" class="layui-btn layui-btn-normal" lay-submit lay-filter="submitBtn">更新</button>
                        </div>
                    </div>
                </form>
                <br><br>
            </div>
        </div>
    </div>
</div>

{/block}

{block name="js"}
<script>
    var layer, form, bwajax, upload, $, laydate,manage,xmSelect,eleTree;

    layui.use(['layer', 'form', 'bwajax', 'upload', 'laydate', 'manage', 'xmSelect','eleTree'], function () {
        layer = layui.layer;
        form = layui.form;
        bwajax = layui.bwajax.instance();
        upload = layui.upload;
        $ = layui.jquery;
        laydate = layui.laydate;
        manage = layui.manage;
        xmSelect = layui.xmSelect;
        eleTree = layui.eleTree;

        //添加时间 日期时间选择器
        laydate.render({
            elem: '#add_time'
            ,type: 'datetime'
        });




        //单图单图上传
        var uploadInst = bw_upload(upload, 'avatar', 'image');

//权限下拉多选---------------------------------------------------  start
//
//
//         bwajax.post("{:Url('manage/member.Role/getRoleTree')}", {
//             checked_ids: '{$data.rules? $data.rules : 0}'
//             ,disabled: '0',
//             is_child:'true'
//         }).then(function (response) {
//             console.log(response.data);
//             //先渲染多选
//             var auth = xmSelect.render({
//                 el: '#auth',
//                 theme: {
//                     color: '#5FB878',
//                 },
//                 content: '<div id="ele2" lay-filter="ele2"></div>',
//             })
//
//
// //渲染自定义内容
//             var ele = layui.eleTree.render({
//                 elem: '#ele2',
//                 data: response.data,
//                 showCheckbox: true,
//                 defaultExpandAll: false,
//                 checkStrictly:true , //严格按照父子不关联
//                 renderAfterExpand:false //未展开也渲染子节点数据
//             });
//
//
// //初始化数据---------------------------------------------end
//
//
//             //初始化选中数据需要后台的树菜单传入checked : true属性
//             var arr = ele.getChecked(false, false);
//             var value = new Array();
//             for (i = 0; i < arr.length; i++) {
//                 value.push(arr[i].id);
//             }
//             auth.update({
//                 prop: {
//                     name: 'label',
//                     value: 'id',
//                 },
//                 initValue: value,
//                 data: arr,
//             }).setValue(arr)
//             $('#auth_id').val(value.toString());
//
//             //初始化数据---------------------------------------------end
//
// //监听下拉多选的选择
//             auth.update({
//                 on({arr, change, isAdd}) {
//                     if (isAdd === false) {
//                         //监听取消
//                         ele.setChecked(arr.map(item => item.id), true);
//                         var value = new Array();
//                         for (i = 0; i < arr.length; i++) {
//                             value.push(arr[i].id);
//                         }
//                         $('#auth_id').val(value.toString());
//                     }
//                 },
//             });
// //监听树的选择
//             layui.eleTree.on("nodeChecked(ele2)", function (d) {
//                 var arr = ele.getChecked(false, false)
//                 console.log(arr)
//                 var value = new Array();
//                 for (i = 0; i < arr.length; i++) {
//                     value.push(arr[i].id);
//                 }
//                 $('#auth_id').val(value.toString());
//                 auth.update({
//                     prop: {
//                         name: 'label',
//                         value: 'id',
//                     },
//                     data: arr,
//                 }).setValue(arr)
//
//             })
//
//         });


//权限下拉多选---------------------------------------------------  end

        //监听提交按钮
        form.on('submit(submitBtn)', function (obj) {
            data = obj.field;

            // if(!data.rule_ids) {layer.msg('请选择角色', {icon: 2});return false}
            // if(!data.username) {layer.msg('用户名不能为空', {icon: 2});return false}
            // if(!data.nickname) {layer.msg('昵称不能为空', {icon: 2});return false}
            if(!data.mobile) {layer.msg('手机号不能为空', {icon: 2});return false}

            delete data['eleTree-node'];
            delete data.select;
            var post_url = "/manage/member/login/userPassword";

            //console.log(data);return false;
            //ajax调用后台接口
            bwajax.post(post_url, data)
                .then(function (response) {
                    if (response.data.data.errcode === 0) {
                        layer.msg('提交成功', {icon: 1});
                        submitSuccess();

                    } else {
                        layer.msg(response.data.msg, {icon: 2});

                    }
                })

            return false;
        })
    });


    function submitSuccess() {
        parent.location.reload();//这里调用的是父页面的reload方法
        setTimeout(function () {
            parent.layer.close(parent.layer.getFrameIndex(window.name));
        }, 1000);
    }

    // //粉丝
    // function getNum(){
    //
    //     layer.open({
    //         type: 2,
    //         title: '图标列表',
    //         shade: 0.8,
    //         //closeBtn: 0, //不显示关闭按钮
    //         shade: [0],
    //         shadeClose: true,//单机空白处消失
    //         maxmin: true,
    //         //anim: 4, //动画类型
    //         area: ['40%','90%'],
    //         content:"{:Url('public_common/icon')}",
    //         btn: ['选择图标'],
    //         yes: function(index, layero){
    //
    //             var nodeName = window["layui-layer-iframe" + index];//父页面引用
    //             var icon = nodeName.getIcon();
    //             if(icon!=false){
    //                 $('#icon').val(icon);
    //                 layer.close(index);
    //                 //处理重复提交
    //             }
    //
    //
    //
    //
    //
    //         }
    //     });
    // }
</script>
{/block}